<script setup>
import userLogin from '@/components/userLogin.vue'
import userRegister from '@/components/userRegister.vue'
import OneCard from '@/components/card.vue'
</script>

<template>
  <div>
    <div class="left"></div>
    <div class="right"></div>
    <div class="start">
      <One-Card class="cardLeft"></One-Card>
      <user-login class="userLogin"></user-login>
      <One-Card class="cardRight"></One-Card>
      <user-register class="userRegister"></user-register>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.child-div {
  position: absolute;
  left: 0%;
  width: 100%;
}
.start {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.left {
  position: absolute;
  width: 50%;
  height: 100%;
  margin-right: 50%;
  background-color: #7ab6b6;
}
.right {
  position: absolute;
  width: 50%;
  height: 100%;
  margin-left: 50%;
  background-color: #e5cfaa;
}
.cardLeft {
  background-color: #7ab6b6;
}
.cardRight {
  background-color: #e5cfaa;
}
</style>
